---
title: Timelines
description: Timeline components built with Tailwind CSS v4. Perfect for visualizing project roadmaps, company histories, event sequences, and progress tracking. Responsive, accessible, and easy to customize for any use case.
emoji: 🕒
tag: new
terms:
  - timeline
  - history
  - roadmap
components:
  - { title: 'Vertical', dark: true, container: max-w-xl mx-auto p-6 }
  - { title: 'Vertical with middle line', dark: true, container: max-w-xl mx-auto p-6 }
  - { title: 'Horizontal', dark: true, container: max-w-5xl mx-auto p-6 }
---

# Timeline Components

<p>{frontmatter.description}</p>

<CollectionList componentsData={componentsData} />
